<template>
  <dv-border-box-12 class="networkRepair">
    <screenTitle :title="title"/>
    <div class="networkRepair-content">
      <dv-scroll-ranking-board :config="config" style="width:100%;height:90px" />
    </div>
  </dv-border-box-12>
</template>

<script>
import screenTitle from './screenTitle'
export default {
  name: 'networkRepair',
  components:{
    screenTitle,
  },
  data(){
    return{
      title: '网络修复',
      config: {
        data: [
          { name: '北京', value: 55 },
          { name: '上海', value: 66 },
          { name: '武汉', value: 29 },
          { name: '广州', value: 73 },
          { name: '杭州', value: 80 },
          { name: '成都', value: 45 },
          { name: '深圳', value: 39 }
        ],
        unit: '%',
      },
    }
  }
}
</script>

<style lang="scss" scoped>
.networkRepair{
  width: 100%;
  height: 100%;
  box-shadow: inset 0px 0px 20px #b7f1f3;
  border-radius: 10px;
}
.networkRepair-content{
  width: 90%;
  height:60%;
  margin: 5% auto 0;
}
</style>
<style lang="scss">
.networkRepair-content{
  .dv-scroll-ranking-board{
    margin-top: 5px;
    .row-item{
      line-height: 30px !important;
      height: 30px !important;
      .ranking-info{
        line-height: 14px !important;
        height: 14px !important;
      }
      .rank{
        color: #fff;
      }
      .ranking-column{
        border-bottom: 1px solid rgba(26,206,233,0.8);
      }
      .inside-column{
        background-color: #1acee9;
      }
    }
  }
}
</style>
